<template>
	<view>
		<view class="is-bg-blue has-pdt-30">
			<view class="do-top has-pdlr-20 s-row-flex">
				<view class="is-col-8 is-left" @tap="timeUp">
					<uni-icons type="arrowleft" color="#FFFFFF" size="28"></uni-icons>
				</view>
				<view class="is-col-8 is-size-18 is-center">帐户</view>
				<view class="is-col-8 is-right"></view>
			</view>
		<!--账户余额 start-->
		<view class="a-top has-pdlr-20">
			<!--余额 start-->			
			<view class="has-pdt-20">我的余额</view>
			<view class="is-size-30 has-mgtb-10"><text>{{userinfo['user_money']}}</text>DC</view>
			<view class="all-dc has-mgb-20">
				<view class="all-dc-li">
					可用：<text class="has-mgr-5">{{userinfo['user_money_can']}}</text>DC
				</view>
				<view class="all-dc-li">
					冻结：<text class="has-mgr-5">{{userinfo['user_money_lock']}}</text>DC
				</view>
			</view>
			<view class="a-button has-mgtb-10">
 				<button type="default" class="a-buttom-l" @click="buydc">
					<text class="is-blue">一键买币</text>
				</button>
				<button type="default" class="a-buttom-r" @click="selldc">
					<text>卖币</text>
				</button>
			</view>			
			<!--余额 end-->
		</view>
	</view>
		<!--账户余额 start-->
		<!--订单 start-->
		<view class="has-pdlr-20 has-mgt-20 the-order">
			<view class="is-grey">订单</view>
			<view class="order-list has-pdtb-10" v-for="(item,index) in list" :key="index" @tap="goinfo(item.money_type,item.id)">
				<view class="has-floatl">
					<view class="">
						<text :class="item.money_type ==1 ? 'is-green' : 'is-blue'">{{item.money_type_name}}</text>
						<text :class="item.money_lock ==1 ? 'is-blue' : (item.money_hand ==1 ? 'is-yellow' : 'is-red')" class ="is-size-14 has-pdl-10">{{item.money_lock_name}}</text>
					</view>
					<view class="is-grey">{{item.money_time}}</view>
				</view>
				<view class="has-floatr order-list-right">
					<text>{{item.money_type_dot}}{{item.money_num_true}}</text>
					<image src="../../static/img/common/right_ico_grey.png" mode=""></image>
				</view>
			</view>
			<view style="flex: 1;">
				<uni-err-box  :errType="errType" :errText="errText" ></uni-err-box>
			</view>
			<view style="flex: 1;">
				<uni-load-more  :loadingType="loadingType" :contentText="contentText" ></uni-load-more>
			</view>
		</view>
		<!--订单 end-->
	</view>
</template>

<script>
var _self,
	page = 1,
	timer = null;
	import uniLoadMore from '@/components/load-more.vue';
	import uniErrBox from '@/components/err-box.vue';
	import uniIcons from "@/components/uni-icons/uni-icons.vue";
	export default{
		components: {
			uniIcons,
			uniLoadMore,
			uniErrBox
		},
		data(){
			return {
				foxtoken:'',
				userinfo:[],
				errType: 0,
				errText: '',
				list:[],
				loadingText: '加载中...',
				loadingType: 0,//定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
				contentText: {
					contentdown:'上拉显示更多',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多了'
				}
			}
		},
		onLoad() {
			_self = this;
			let info = this.service.getfox();
			if(info[0]){
				//console.log(info[0])				
				this.foxtoken = info[0]['foxtoken'];
				// uni.clearStorageSync();
				uni.request({
					url: this.service.FOX_URL + 'diamond/get_userinfo_set',
					method:'POST',
					data: {
						user_key: this.foxtoken
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded',
					},
					success: res => {
						// var rest = JSON.stringify(res);
						// console.log(res)
						var rest = res.data;
						if(rest.status == 'success'){
							this.userinfo = rest.msg;
						}else if(rest.status == 'error'){
							uni.showToast({
								title:rest.msg,
								icon:'none',
								mask:true
							})
						}
					}
				})
			}else{
				uni.reLaunch({
					url:'../logon/login'
				})
			}
			this.getMoneyList();
		},
		//下拉刷新
		onPullDownRefresh: function() {
			this.getMoneyList();
		},
		// 加载更多
		onReachBottom : function(){
			if (timer != null) {
				clearTimeout(timer);
			}
			timer = setTimeout(function() {
				_self.getMoneyMore();
			}, 1000);
		},
		methods:{
			// 数据和分页是模拟的实际也是这样写
			getMoneyMore: function(){
				if (_self.loadingType !== 0) {//loadingType!=0;直接返回
					return false;
				}
				_self.loadingType = 1;
				uni.showNavigationBarLoading();//显示加载动画
				uni.request({
					url: this.service.FOX_URL + 'diamond/money_list',
					method:'POST',
					data: {
						page:page,
						limit:10,
						user_key:this.foxtoken
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					success: res => {
						var foxmsg = res.data;
						console.log(foxmsg)
						if (foxmsg.data.list == null  || foxmsg.data.list.length==0) {//没有数据
							_self.loadingType = 2;
							uni.hideNavigationBarLoading();//关闭加载动画
							return;
						}
						page++;//每触底一次 page +1
						_self.list = _self.list.concat(foxmsg.data.list);//将数据拼接在一起
						_self.loadingType = 0;//将loadingType归0重置
						uni.hideNavigationBarLoading();//关闭加载动画
					},
					complete: res => {
						uni.hideLoading();
						uni.stopPullDownRefresh();
					}
				});
			},
			getMoneyList: function() {//第一次回去数据
				page = 1;
				this.loadingType = 0;
				uni.showNavigationBarLoading();
				uni.request({
					url: this.service.FOX_URL + 'diamond/money_list',
					method:'POST',
					data:{
						page:page,
						limit:10,
						user_key:this.foxtoken
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					success: res => {
						page++;//得到数据之后page+1
						var foxmsg = res.data;
						// console.log(foxmsg)
						if (foxmsg.code == 200) {                    
							_self.list = foxmsg.data.list;
							if (foxmsg.data.list.length > 0 && foxmsg.data.list.length < 10) {//没有数据
								_self.loadingType = 5;
								uni.hideNavigationBarLoading();//关闭加载动画
								return;
							}
							if (foxmsg.data.list.length == 0) {
								_self.errType = 1;
								_self.loadingType = 4;
								uni.hideNavigationBarLoading();//关闭加载动画
								return;
							}
							uni.hideNavigationBarLoading();
							uni.stopPullDownRefresh();//得到数据后停止下拉刷新
						}else{
							_self.errType = 1;
							_self.loadingType = 4;
							uni.hideNavigationBarLoading();//关闭加载动画
							return;
						}                         
					}
				});
			},
			buydc(){
				uni.navigateTo({
					url:'./buydc'
				})
			},
			selldc(){
				uni.navigateTo({
					url:'./selldc'
				})
			},
			timeUp(){
				uni.navigateTo({
					url:'/pages/index/index'
				})
			},
			goinfo:function(type,id){
				if(type == 0){
					uni.navigateTo({
						url:'./buydo?id='+id
					})
				}else if(type == 1){
					uni.navigateTo({
						url:'./selldo?id='+id
					})
				}
			}
		}
	}
</script>

<style>
	.do-top{
		background-color: #007AFF;
		color:#fff;
		padding:20rpx 0;
	}
	.a-top{
		background-color: #007AFF;
		height: 400rpx;
		color:#fff;
	}
	.all-dc{
		width:100%
	}
	.all-dc-li{
		width:50%;
		display: inline-block;
	}
	.a-button button{
		display: inline-block;
		border-radius: 0;
		height: 70rpx;
		line-height: 70rpx;
	}
	.a-buttom-l{
		width:65%;
		margin-right:5%;
	}
	.a-buttom-r{
		width:30%;
	}
	.order-list{
		height: 120rpx;
		line-height: 60rpx;
		border-bottom: 2rpx solid #E5E5E5;
	}
	.order-list-right image{
		width:30rpx;
		height: 30rpx;
		margin-left: 10rpx;
	}
</style>
